// src/utils/useRenderIcon.ts

import { h, defineComponent } from 'vue'

/**
 * 渲染图标组件，支持字符串（iconfont 名称）或直接传入组件
 * @param icon 图标标识（例如：'IF-home'）或组件
 * @param props 可选的属性（如 class）
 * @returns 可用于 `<component :is="...">` 的组件
 */
export function useRenderIcon(icon: string | any, props: Record<string, any> = {}) {
  if (!icon) return null

  // 如果是组件，直接返回
  if (typeof icon === 'object') return icon

  // 如果是字符串，默认渲染 iconfont（类名以 IF- 开头）
  return defineComponent({
    name: 'DynamicIcon',
    setup() {
      return () =>
        h('i', {
          class: [`iconfont`, icon.startsWith('IF-') ? icon : `IF-${icon}`, props.class || ''],
          ...props,
        })
    },
  })
}
